<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <button onclick=""></button>
  <script>
    // function curry(fn){
    //   return function mid(...args){
    //     // console.log(args)
    //     if(args.length == fn.length){
    //       return fn(...args)
    //     }else{
    //       return (...arg)=>mid(...args,...arg)
    //     }
    //   }
    // }
    
    // function add(a, b, c) {
    //   return a + b + c
    // }
    // add(1, 2, 3)
    // let addCurry = curry(add)
    // // console.log(addCurry)
    // // console.log(addCurry(1))
    // // console.log(addCurry(1)(2))
    // // console.log(addCurry(1)(2)(3))
    // console.log(addCurry(_,1)(2)(3))
    // // addCurry(1)(2)(3)


/**
 * @param { Function } func
 */
 function curry(func) {
  return function curried(...args) {
    const complete = args.length >= func.length && !args.slice(0, func.length).includes(curry.placeholder);
    if(complete) return func.apply(this, args)
    return function(...newArgs) {
      // replace placeholders in args with values from newArgs
      console.log(newArgs)
      console.log(args)
      const res = args.map(arg => arg === curry.placeholder && newArgs.length ? newArgs.shift() : arg);
      console.log(res)
      return curried(...res, ...newArgs);
    }
  }
}

curry.placeholder = Symbol()

const  join = (a, b, c) => {
   return `${a}_${b}_${c}`
}

const curriedJoin = curry(join)
const _ = curry.placeholder
// console.log(curriedJoin(1, 2, 3)) // 
console.log(1111)
console.log(curriedJoin(_, _, _)) // 
console.log(2222)
console.log(curriedJoin(_, _, _)(1)) // 
console.log(3333)
console.log(curriedJoin(_, _, _)(1)(_, 3)) // 
console.log(4444)
console.log(curriedJoin(_, _, _)(1)(_, 3)(2)) // 

// console.log(curriedJoin(_, _, _)(1)(_, 3)(2)) // 

  </script>
</body>
</html>